
const _interopRequireDefault = require('@babel/runtime/helpers/interopRequireDefault');

exports.__esModule = true;
exports.default = void 0;

const _utils = require('../utils');

const _touch = require('../mixins/touch');

const _loading = _interopRequireDefault(require('../loading'));

const _DeleteIcon = _interopRequireDefault(require('./DeleteIcon'));

const _CollapseIcon = _interopRequireDefault(require('./CollapseIcon'));

const _createNamespace = (0, _utils.createNamespace)('key');
const createComponent = _createNamespace[0];
const bem = _createNamespace[1];

const _default = createComponent({
  mixins: [_touch.TouchMixin],
  props: {
    type: String,
    text: [Number, String],
    color: String,
    wider: Boolean,
    large: Boolean,
    loading: Boolean,
  },
  data: function data() {
    return {
      active: false,
    };
  },
  mounted: function mounted() {
    this.bindTouchEvent(this.$el);
  },
  methods: {
    onTouchStart: function onTouchStart(event) {
      // compatible with Vue 2.6 event bubble bug
      event.stopPropagation();
      this.touchStart(event);
      this.active = true;
    },
    onTouchMove: function onTouchMove(event) {
      this.touchMove(event);

      if (this.direction) {
        this.active = false;
      }
    },
    onTouchEnd: function onTouchEnd() {
      if (this.active) {
        this.active = false;
        this.$emit('press', this.text, this.type);
      }
    },
    genContent: function genContent() {
      const h = this.$createElement;
      const isExtra = this.type === 'extra';
      const isDelete = this.type === 'delete';
      const text = this.slots('default') || this.text;

      if (this.loading) {
        return h(_loading.default, {
          class: bem('loading-icon'),
        });
      }

      if (isDelete) {
        return text || h(_DeleteIcon.default, {
          class: bem('delete-icon'),
        });
      }

      if (isExtra) {
        return text || h(_CollapseIcon.default, {
          class: bem('collapse-icon'),
        });
      }

      return text;
    },
  },
  render: function render() {
    const h = arguments[0];
    return h('div', {
      class: bem('wrapper', {
        wider: this.wider,
      }),
    }, [h('button', {
      attrs: {
        type: 'button',
      },
      class: bem([this.color, {
        large: this.large,
        active: this.active,
        delete: this.type === 'delete',
      }]),
    }, [this.genContent()])]);
  },
});

exports.default = _default;
